<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的订单</title>
    <link rel="stylesheet" href="../../css/aui.css">
    <link rel="stylesheet" type="text/css" href="../../css/aui-flex.css" />
    <link rel="stylesheet" href="../../css/main.css">
    <link rel="stylesheet" href="./css/indent.css">
</head>
<body>
<header class="aui-bar aui-bar-nav aui-bar-top">
    <a class="aui-pull-left aui-btn goBack" >
        <span class="aui-iconfont aui-icon-left"></span>
    </a>
    <div class="aui-title">我的订单</div>
</header>
<section id="app">
<keep-alive>
    <router-view></router-view>
</keep-alive>
</section>
<script type="text/javascript" src="../../js/zepto.min.js"></script>
<script type="text/javascript" src="../../js/api.js"></script>
<script type="text/javascript" src="../../js/aui-tab.js"></script>
<script type="text/javascript" src="../../js/vue.min.js"></script>
<script type="text/javascript" src="../../js/vue-router.min.js"></script>
<script type="text/javascript" src="../../js/aui-list-swipe-backup.js"></script>
<script src="./js/indent.js"></script>

<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript" src="../../js/weixin.js" ></script>
<script type="text/javascript">
    //全部订单详情
    var showAllIndent = Vue.component('textIndent',{
        methods:{
            goAllIndent:function(){
                this.$router.push('/allIndent')
            },
            goDfk:function(){
                this.$router.push('/dfkIndent')
            },
            goDfh:function(){
                this.$router.push('/dfhIndent')
            },
            goDsh:function(){
                this.$router.push('/dshIndent')
            },
            goDpj:function(){
                this.$router.push('/dpjIndent')
            },
            goOrderDetail:function(){
                window.location.href = "../order_detail/order_detail.html";
            },
//            goIndent:function(){
//                window.location.href = "../order_detail/order_detail.html";
//            },
            abolishBtn:function(){
              $(".indent").remove()
            }
        },
        template:`
        <div>
         <div  class="aui-grid aui-margin-b-15">
        <div class="aui-tab" id="tab">
            <div class=" aui-tab-item  aui-active " @click="goAllIndent()">
                <div class="aui-grid-label">全部 </div>
            </div>
            <div class=" aui-tab-item " @click="goDfk()">
                <div class="aui-grid-label">待付款</div>
            </div>
            <div class=" aui-tab-item " @click="goDfh()">
                <div class="aui-grid-label">待发货</div>
            </div>
            <div class=" aui-tab-item " @click="goDsh()">
                <div class="aui-grid-label">待收货</div>
            </div>
            <div class=" aui-tab-item " @click="goDpj()">
                <div class="aui-grid-label">待评价</div>
            </div>
        </div>
    </div>
    <div class="indent">
       <div  class="aui-grid">
        <div class="aui-row aui-margin-t-5 goodsList">
            <div class="aui-col-xs-4" @click="">
                <div class="aui-grid-label">超急店小普专营</div>
            </div>
            <div class="aui-col-xs-4 aui-flex-offset-4" @click="">
                <div class="aui-font-size-12 aui-text-success">待付款</div>
                <div class="aui-grid-label aui-font-size-12 ">订单号:2017121212</div>
            </div>
        </div>
    </div>
       <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-2 aui-padded-l-15" @click="">
                <img src="../../images/1.png" alt="">
            </div>
            <div class="aui-col-xs-5" @click="">
                <div class="aui-grid-label aui-font-size-12 ">产品介绍</div>
            </div>
            <div class="aui-col-xs-2 aui-flex-offset-2" @click="">
                <div class="aui-font-size-12 aui-text-success">￥19.9</div>
                <div class="aui-grid-label aui-font-size-12 ">￥19.9</div>
                <div class="aui-font-size-12">0.020Kg</div>
                <div class="aui-grid-label aui-font-size-12 ">X1</div>
            </div>
        </div>
    </div>
       <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-4 aui-grid-label aui-font-size-12" >
               <span>2017-12-12</span><span>16:00:00</span>
            </div>
            <div class="aui-col-xs-8" @click="">
                <div class="aui-grid-label aui-font-size-12 ">
                    共<span>1</span>件商品 合计:<span>￥19.90</span>(含运费:￥<span>0</span>)
                </div>
            </div>
        </div>
    </div>
       <div class="aui-flex-col aui-flex-item-2 aui-flex-offset-9" v-on:click="goIndent()">
          <p><div class="aui-btn aui-btn-danger aui-btn-default aui-btn-outlined aui-btn-sm aui-btn-sm">去付款</div></p>
     </div>
       <div class="aui-flex-col aui-flex-item-12 aui-padded-5">
        <p class="aui-flex-row aui-flex-offset-5">
        <div class="aui-btn aui-btn-default aui-btn-default aui-btn-outlined aui-btn-sm aui-flex-item-3" @click="goOrderDetail()">订单详情</div>
        <div class="aui-btn aui-btn-default aui-btn-default aui-btn-outlined aui-btn-sm  aui-flex-item-3 aui-margin-l-5" @click="abolishBtn()">取消订单</div>
        </p>
        </div>
     </div>
</div>
        `
    })
    //代付款
    var showDfkIndent = Vue.component('textIndent',{
        methods:{
            goAllIndent:function(){
                this.$router.push('/allIndent')
            },
            goDfk:function(){
                this.$router.push('/dfkIndent')
            },
            goDfh:function(){
                this.$router.push('/dfhIndent')
            },
            goDsh:function(){
                this.$router.push('/dshIndent')
            },
            goDpj:function(){
                this.$router.push('/dpjIndent')
            },
            goOrderDetail:function(){
                window.location.href = "../order_detail/order_detail.html";
            }
        },
        template:`
        <div>
           <div  class="aui-grid aui-margin-b-15">
        <div class="aui-tab" id="tab">
            <div class=" aui-tab-item  " @click="goAllIndent()">
                <div class="aui-grid-label">全部 </div>
            </div>
            <div class=" aui-tab-item  aui-active" @click="goDfk()">
                <div class="aui-grid-label">待付款</div>
            </div>
            <div class=" aui-tab-item " @click="goDfh()">
                <div class="aui-grid-label">待发货</div>
            </div>
            <div class=" aui-tab-item " @click="goDsh()">
                <div class="aui-grid-label">待收货</div>
            </div>
            <div class=" aui-tab-item " @click="goDpj()">
                <div class="aui-grid-label">待评价</div>
            </div>
        </div>
    </div>
            <div  class="aui-grid">
        <div class="aui-row aui-margin-t-5 goodsList">
            <div class="aui-col-xs-4">
                <div class="aui-grid-label">超急店小普专营</div>
            </div>
            <div class="aui-col-xs-4 aui-flex-offset-4" >
                <div class="aui-font-size-12 aui-text-success">待付款</div>
                <div class="aui-grid-label aui-font-size-12 ">订单号:2017121212</div>
            </div>
        </div>
    </div>
    <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-2 aui-margin-l-15">
                <img src="../../images/1.png" alt="">
            </div>
            <div class="aui-col-xs-5" >
                <div class="aui-grid-label aui-font-size-12 ">产品介绍</div>
            </div>
            <div class="aui-col-xs-2 aui-flex-offset-2">
                <div class="aui-font-size-12 aui-text-success">￥19.9</div>
                <div class="aui-grid-label aui-font-size-12 ">￥19.9</div>
                <div class="aui-font-size-12">0.020Kg</div>
                <div class="aui-grid-label aui-font-size-12 ">X1</div>
            </div>
        </div>
    </div>
    <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-4 aui-grid-label aui-font-size-12" >
               <span>2017-12-12</span><span>16:00:00</span>
            </div>
            <div class="aui-col-xs-8">
                <div class="aui-grid-label aui-font-size-12 ">
                    共<span>1</span>件商品 合计:<span>￥19.90</span>(含运费:￥<span>0</span>)
                </div>
            </div>
        </div>
    </div>
      <div class="aui-flex-col aui-flex-item-2 aui-flex-offset-9 ">
          <p><div class="aui-btn aui-btn-danger aui-btn-default aui-btn-outlined aui-btn-sm aui-btn-sm">去付款</div></p>
     </div>
    <div class="aui-flex-col aui-flex-item-12  aui-padded-5">
        <p class="aui-flex-row aui-flex-offset-5">
        <div class="aui-btn aui-btn-default aui-btn-default aui-btn-outlined aui-btn-sm aui-flex-item-3" @click="goOrderDetail()">订单详情</div>
        <div class="aui-btn aui-btn-default aui-btn-default aui-btn-outlined aui-btn-sm  aui-flex-item-3 aui-margin-l-5">取消订单</div>
        </p>
    </div>

        </div>
        `
    })
    //待发货
    var showDfhIndent = Vue.component('textIndent',{
        methods:{
            goAllIndent:function(){
                this.$router.push('/allIndent')
            },
            goDfk:function(){
                this.$router.push('/dfkIndent')
            },
            goDfh:function(){
                this.$router.push('/dfhIndent')
            },
            goDsh:function(){
                this.$router.push('/dshIndent')
            },
            goDpj:function(){
                this.$router.push('/dpjIndent')
            },
            goOrderDetail:function(){
                window.location.href = "../order_detail/order_detail.html";
            }
        },
        template:`
        <div>
         <div  class="aui-grid aui-margin-b-15">
        <div class="aui-tab" id="tab">
            <div class=" aui-tab-item  " @click="goAllIndent()">
                <div class="aui-grid-label">全部 </div>
            </div>
            <div class=" aui-tab-item " @click="goDfk()">
                <div class="aui-grid-label">待付款</div>
            </div>
            <div class=" aui-tab-item  aui-active" @click="goDfh()">
                <div class="aui-grid-label">待发货</div>
            </div>
            <div class=" aui-tab-item " @click="goDsh()">
                <div class="aui-grid-label">待收货</div>
            </div>
            <div class=" aui-tab-item " @click="goDpj()">
                <div class="aui-grid-label">待评价</div>
            </div>
        </div>
    </div>
            <div  class="aui-grid">
        <div class="aui-row aui-margin-t-5 goodsList">
            <div class="aui-col-xs-4" @click="">
                <div class="aui-grid-label">超急店小普专营</div>
            </div>
            <div class="aui-col-xs-4 aui-flex-offset-4" @click="">
                <div class="aui-font-size-12 aui-text-success">待发货</div>
                <div class="aui-grid-label aui-font-size-12 ">订单号:2017121212</div>
            </div>
        </div>
    </div>
    <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-2 aui-margin-l-15">
                <img src="../../images/1.png" alt="">
            </div>
            <div class="aui-col-xs-5">
                <div class="aui-grid-label aui-font-size-12 ">产品介绍</div>
            </div>
            <div class="aui-col-xs-2 aui-flex-offset-2">
                <div class="aui-font-size-12 aui-text-success">￥19.9</div>
                <div class="aui-grid-label aui-font-size-12 ">￥19.9</div>
                <div class="aui-font-size-12">0.020Kg</div>
                <div class="aui-grid-label aui-font-size-12 ">X1</div>
            </div>
        </div>
    </div>
    <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-4 aui-grid-label aui-font-size-12" >
               <span>2017-12-12</span><span>16:00:00</span>
            </div>
            <div class="aui-col-xs-8">
                <div class="aui-grid-label aui-font-size-12 ">
                    共<span>1</span>件商品 合计:<span>￥19.90</span>(含运费:￥<span>0</span>)
                </div>
            </div>
        </div>
    </div>
      <div class="aui-flex-col aui-flex-item-2 aui-flex-offset-8 ">
          <p><div class="aui-btn aui-btn-danger aui-btn-default aui-btn-outlined aui-btn-sm aui-btn-sm">提醒发货</div></p>
     </div>
    <div class="aui-flex-col aui-flex-item-12 aui-padded-5">
        <p class="aui-flex-row aui-flex-offset-5">
        <div class="aui-btn aui-btn-default aui-btn-default aui-btn-outlined aui-btn-sm aui-flex-item-3" @click="goOrderDetail()">订单详情</div>
        <div class="aui-btn aui-btn-default aui-btn-default aui-btn-outlined aui-btn-sm  aui-flex-item-3 aui-margin-l-5">待收货</div>
        </p>
    </div>

        </div>
        `
    })
    //待收货
    var showDshIndent = Vue.component('textIndent',{
        methods:{
            goAllIndent:function(){
                this.$router.push('/allIndent')
            },
            goDfk:function(){
                this.$router.push('/dfkIndent')
            },
            goDfh:function(){
                this.$router.push('/dfhIndent')
            },
            goDsh:function(){
                this.$router.push('/dshIndent')
            },
            goDpj:function(){
                this.$router.push('/dpjIndent')
            },
            goOrderDetail:function(){
                window.location.href = "../order_detail/order_detail.html";
            }
        },
        template:`
        <div>
        <div  class="aui-grid aui-margin-b-15">
        <div class="aui-tab" id="tab">
            <div class=" aui-tab-item  " @click="goAllIndent()">
                <div class="aui-grid-label">全部 </div>
            </div>
            <div class=" aui-tab-item " @click="goDfk()">
                <div class="aui-grid-label">待付款</div>
            </div>
            <div class=" aui-tab-item " @click="goDfh()">
                <div class="aui-grid-label">待发货</div>
            </div>
            <div class=" aui-tab-item  aui-active" @click="goDsh()">
                <div class="aui-grid-label">待收货</div>
            </div>
            <div class=" aui-tab-item " @click="goDpj()">
                <div class="aui-grid-label">待评价</div>
            </div>
        </div>
    </div>
            <div  class="aui-grid">
        <div class="aui-row aui-margin-t-5 goodsList">
            <div class="aui-col-xs-4" @click="">
                <div class="aui-grid-label">超急店小普专营</div>
            </div>
            <div class="aui-col-xs-4 aui-flex-offset-4" @click="">
                <div class="aui-font-size-12 aui-text-success">待收货</div>
                <div class="aui-grid-label aui-font-size-12 ">订单号:2017121212</div>
            </div>
        </div>
    </div>
    <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-2 aui-margin-l-15" @click="">
                <img src="../../images/1.png" alt="">
            </div>
            <div class="aui-col-xs-5" @click="">
                <div class="aui-grid-label aui-font-size-12 ">产品介绍</div>
            </div>
            <div class="aui-col-xs-2 aui-flex-offset-2" @click="">
                <div class="aui-font-size-12 aui-text-success">￥19.9</div>
                <div class="aui-grid-label aui-font-size-12 ">￥19.9</div>
                <div class="aui-font-size-12">0.020Kg</div>
                <div class="aui-grid-label aui-font-size-12 ">X1</div>
            </div>
        </div>
    </div>
    <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-4 aui-grid-label aui-font-size-12" >
               <span>2017-12-12</span><span>16:00:00</span>
            </div>
            <div class="aui-col-xs-8" @click="">
                <div class="aui-grid-label aui-font-size-12 ">
                    共<span>1</span>件商品 合计:<span>￥19.90</span>(含运费:￥<span>0</span>)
                </div>
            </div>
        </div>
    </div>
      <div class="aui-flex-col aui-flex-item-6 aui-flex-offset-6 ">
          <div class="aui-btn aui-btn-default aui-btn-outlined aui-btn-sm aui-margin-r-10 ">删除订单</div>
          <div class="aui-btn aui-btn-danger  aui-btn-outlined aui-btn-sm">确认收货</div>
     </div>

        </div>
        `
    })
    //待评价
    var showDpjIndent = Vue.component('textIndent',{
        methods:{
            goAllIndent:function(){
                this.$router.push('/allIndent')
            },
            goDfk:function(){
                this.$router.push('/dfkIndent')
            },
            goDfh:function(){
                this.$router.push('/dfhIndent')
            },
            goDsh:function(){
                this.$router.push('/dshIndent')
            },
            goDpj:function(){
                this.$router.push('/dpjIndent')
            },
            goOrderDetail:function(){
                window.location.href = "../order_detail/order_detail.html";
            },
            goCommentDistrict:function(){
                window.location.href = "../order_detail/commentDistrict.html";
            }
        },
        template:`
        <div>
          <div  class="aui-grid aui-margin-b-15">
        <div class="aui-tab" id="tab">
            <div class=" aui-tab-item " @click="goAllIndent()">
                <div class="aui-grid-label">全部 </div>
            </div>
            <div class=" aui-tab-item " @click="goDfk()">
                <div class="aui-grid-label">待付款</div>
            </div>
            <div class=" aui-tab-item " @click="goDfh()">
                <div class="aui-grid-label">待发货</div>
            </div>
            <div class=" aui-tab-item " @click="goDsh()">
                <div class="aui-grid-label">待收货</div>
            </div>
            <div class=" aui-tab-item  aui-active " @click="goDpj()">
                <div class="aui-grid-label">待评价</div>
            </div>
        </div>
    </div>
      <div  class="aui-grid">
        <div class="aui-row aui-margin-t-5 goodsList">
            <div class="aui-col-xs-4" @click="">
                <div class="aui-grid-label">超急店小普专营</div>
            </div>
            <div class="aui-col-xs-4 aui-flex-offset-4" @click="">
                <div class="aui-font-size-12 aui-text-success">待评价</div>
                <div class="aui-grid-label aui-font-size-12 ">订单号:2017121212</div>
            </div>
        </div>
    </div>
    <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-2 aui-margin-l-15" @click="">
                <img src="../../images/1.png" alt="">
            </div>
            <div class="aui-col-xs-5" @click="">
                <div class="aui-grid-label aui-font-size-12 ">产品介绍</div>
            </div>
            <div class="aui-col-xs-2 aui-flex-offset-2" @click="">
                <div class="aui-font-size-12 aui-text-success">￥19.9</div>
                <div class="aui-grid-label aui-font-size-12 ">￥19.9</div>
                <div class="aui-font-size-12">0.020Kg</div>
                <div class="aui-grid-label aui-font-size-12 ">X1</div>
            </div>
        </div>
    </div>
    <div  class="aui-grid">
        <div class="aui-row goodsList">
            <div class="aui-col-xs-4 aui-grid-label aui-font-size-12" >
               <span>2017-12-12</span><span>16:00:00</span>
            </div>
            <div class="aui-col-xs-8" @click="">
                <div class="aui-grid-label aui-font-size-12 ">
                    共<span>1</span>件商品 合计:<span>￥19.90</span>(含运费:￥<span>0</span>)
                </div>
            </div>
        </div>
    </div>
     <div class="aui-flex-col aui-flex-item-6 aui-flex-offset-6 ">
          <div class="aui-btn aui-btn-default aui-btn-outlined aui-btn-sm aui-margin-r-10 ">删除订单</div>
          <div class="aui-btn aui-btn-danger  aui-btn-outlined aui-btn-sm">评价</div>
     </div>

        </div>
        `
    })



    //配置路由词典
    const myRoutes = [
//当path为空，相当于是指定页面打开时，默认要加载谁
        {path:'',component:showAllIndent},
        {path:'/allIndent',component:showAllIndent},
        {path:'/dfkIndent',component:showDfkIndent},
        {path:'/dfhIndent',component:showDfhIndent},
        {path:'/dshIndent',component:showDshIndent},
        {path:'/dpjIndent',component:showDpjIndent}
    ]
    const myRouter = new VueRouter({
        routes:myRoutes
    })
    var xpHome = new Vue({
        router:myRouter,
        el:'#app',
        data:{},
        methods: {
            goData: function () {//我的资料
                window.location.href = "";
            }
//            goOrderDetail:function(){//订单详情页
//                window.location.href = "../order_detail/order_detail.html";
//            }
        }
    });

</script>
</body>
</html>